<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport"
	      content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" href="css/bootstrap.css">
	<script src="js/jquery-slim.min.js"></script>
	<script src="js/popper.min.js"></script>
	<script src="js/bootstrap.js"></script>
	<title>test_grid3</title>
	<style>
		.my_top{height: 377px; background: #069}
		.mybottom{height: 233px; background: #069}
	</style>
</head>
<body>

<div class="container">
	<div class="row border border-dark no-gutters">
		<div class="col-lg-7 col-sm-12">
			<div class="my_top mr-lg-1 mb-1">
			
			</div>
		</div>
		<div class="col-lg-5 col-sm-12">
			<div class="my_top mb-1">
			
			</div>
		</div>
		<div class="col-lg-5 col-sm-12">
			<div class="mybottom mr-lg-1 mb-lg-0 mb-sm-1"></div>
		</div>
		<div class="col-lg-7 col-sm-12">
			<div class="row no-gutters">
				<div class="col-4">
					<div class="mybottom mr-1">
					
					</div>
				</div>
				<div class="col-4">
					<div class="mybottom mr-1">
					
					</div>
				</div>
				<div class="col-4">
					<div class="mybottom">
					
					</div>
				</div>
			</div>
		</div>
		
		
	</div>
</div>


<br><br><br><br>

</body>
</html>